<template>
  <div class="container">
    <div class="container-1200">
      <div class="title mg-B20">国家双创示范基地企业数据统计表</div>
      <el-row class="rowBorder rowTopBorder">
          <el-col :span="4" class="col-flex bg-ccc leftAlign-pd30 request"
            >企业名称</el-col
          >
          <el-col :span="20" class="col-flex colLeftBorder leftAlign-pd30">{{
            companyName
          }}</el-col>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="4" class="col-flex bg-ccc leftAlign-pd30 request"
            >填报人</el-col
          >
          <el-col :span="8" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">
            {{projectExecuteForm.tbr}}
          </el-col>
          <el-col :span="4" class="col-flex bg-ccc leftAlign-pd30 request"
            >联系方式</el-col
          >
          <el-col :span="8" class="col-flex colLeftBorder leftAlign-pd30">
            {{projectExecuteForm.lxfs}}
          </el-col>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="4" class="col-flex bg-ccc leftAlign-pd30 request"
            >项目名称</el-col
          >
          <el-col
            :span="20"
            class="col-flex colLeftBorder leftAlign-pd30"
          >
            {{projectExecuteForm.projectName}}
          </el-col>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="16" class="col-flex bg-ccc leftAlign-pd30 request"
            >1、项目总投资金额<span class="col-red"
              >（截止当月的总投资金额）</span
            ></el-col
          >
          <el-col :span="4" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">
            {{projectExecuteForm.ytz}}
          </el-col>
          <el-col :span="4" class="col-flex bg-ccc">万元</el-col>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="16" class="col-flex bg-ccc leftAlign-pd30 request"
            >2、支持带动的中小企业数量<span class="col-red"
              >（本年期间，有发生过交易、合作研发、委托代理等关系的中小企业数量）</span
            ></el-col
          >
          <el-col :span="4" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">
            {{projectExecuteForm.dzzxqys}}
          </el-col>
          <el-col :span="4" class="col-flex bg-ccc">个</el-col>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="16" class="col-flex bg-ccc leftAlign-pd30 request"
            >3、支持中小企业创新产业种类</el-col
          >
          <el-col :span="4" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">
            {{projectExecuteForm.zczxqycxzl}}
          </el-col>
          <el-col :span="4" class="col-flex bg-ccc">件</el-col>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="16" class="col-flex bg-ccc leftAlign-pd30 request"
            >4、预计攻克技术难点数量<span class="col-red"
              >（从项目开始实施至今碰到的技术难点、痛点）</span
            ></el-col
          >
          <el-col :span="4" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">
            {{projectExecuteForm.yjgkjsnd}}
          </el-col>
          <el-col :span="4" class="col-flex bg-ccc">个</el-col>
        </el-row>
        <el-row class="rowBorder leftAlign-pd60 ">
          <div class="content-box ">
            <div class="dot content-title">技术难点简述：</div>
            <div class="content " v-for="item,index in listInfo.jsndjs" >
              <div class="content-laber" style="width: 70px;">难点{{index+1}}：</div>
              <el-input type="textarea" :rows="1" v-model="item.content" disabled></el-input>
              <!-- <el-button type="danger" icon="el-icon-delete" circle size="mini" class="delete" @click="deleteItem('jsndjs',index)" v-if="listInfo.jsndjs.length>1"></el-button> -->
              </div>
            <!-- <div><el-button type="text" @click="addItem('jsndjs')">添加</el-button>（超过请自行点击添加）</div> -->
          </div>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="16" class="col-flex bg-ccc leftAlign-pd30 request"
            >5、专项已攻克的技术难点数量<span class="col-red"
              >（根据第4点的填写内容，对应完成的可以纳入该项统计）</span
            ></el-col
          >
          <el-col :span="4" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">
            {{projectExecuteForm.gkjsnd}}
          </el-col>
          <el-col :span="4" class="col-flex bg-ccc">个</el-col>
        </el-row>
        <el-row class="rowBorder leftAlign-pd60 ">
          <div class="content-box ">
            <div class="dot content-title">攻克情况简述：</div>
            <div class="content " v-for="item,index in listInfo.gkqkjs" >
              <div class="content-laber" style="width: 140px;">难点{{index+1}}攻克情况：</div>
              <el-input type="textarea" :rows="1" v-model="item.content" disabled></el-input>
              <!-- <el-button type="danger" icon="el-icon-delete" circle size="mini" class="delete" @click="deleteItem('gkqkjs',index)" v-if="listInfo.gkqkjs.length>1"></el-button> -->
              </div>
            <!-- <div><el-button type="text" @click="addItem('gkqkjs')">添加</el-button>（超过请自行点击添加）</div> -->
          </div>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="16" class="col-flex bg-ccc leftAlign-pd30 request"
            >6、共同研制技术标准数量<span class="col-red"
              >（至少需为区域行业内的统一标准，方可纳入计算）</span
            ></el-col
          >
          <el-col :span="4" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">
            {{projectExecuteForm.gtyzjsbzsl}}
          </el-col>
          <el-col :span="4" class="col-flex bg-ccc">个</el-col>
        </el-row>
        <el-row class="rowBorder leftAlign-pd60 ">
          <div class="content-box ">
            <div class="dot content-title">技术标准简述：</div>
            <div class="content " v-for="item,index in listInfo.jsbzjs" >
              <div class="content-laber" style="width: 70px;">标准{{index+1}}：</div>
              <el-input type="textarea" :rows="1" v-model="item.content" disabled> </el-input>
              <!-- <el-button type="danger" icon="el-icon-delete" circle size="mini" class="delete" @click="deleteItem('jsbzjs',index)" v-if="listInfo.jsbzjs.length>1"></el-button> -->
              </div>
            <!-- <div><el-button type="text" @click="addItem('jsbzjs')">添加</el-button>（超过请自行点击添加）</div> -->
          </div>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="16" class="col-flex bg-ccc leftAlign-pd30 request"
            >7、投资中小企业技术成果数量<span class="col-red"
              >（包含技术成果交易及对拥有技术成果的企业进行股权投资的数量之和）</span
            ></el-col
          >
          <el-col :span="4" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">
            {{projectExecuteForm.tzzxqyjscgsl}}
          </el-col>
          <el-col :span="4" class="col-flex bg-ccc">个</el-col>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="16" class="col-flex bg-ccc leftAlign-pd30 request"
            >8、投资中小企业技术成果金额<span class="col-red"
              >（包含技术成果交易及对拥有技术成果的企业进行股权投资的金额之和）</span
            ></el-col
          >
          <el-col :span="4" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">
            {{projectExecuteForm.tzzxqyjscgje}}
          </el-col>
          <el-col :span="4" class="col-flex bg-ccc">个</el-col>
        </el-row>
        <el-row class="rowBorder leftAlign-pd60 ">
          <div class="content-area ">
            <div class="dot content-title">技术成果交易：</div>
            <div class="content" v-for="item,index in listInfo.jscgjy" >
              <div class="content-laber" style="width:220px">技术成果{{index+1}}名称：</div>
              <el-input v-model="item.technologyName" class="line-input" disabled> </el-input>
              <div class="content-laber" style="width:170px">，成交金额：</div>
              <el-input  v-model="item.amount" class="line-input" style="width:200px" disabled> </el-input>
              <div class="content-laber" style="width:100px">亿元</div>
              <!-- <el-button type="danger" icon="el-icon-delete" circle size="mini" class="delete" @click="deleteItem('jscgjy',index)" v-if="listInfo.jscgjy.length>1"></el-button> -->
              </div>
            <!-- <div><el-button type="text" @click="addItem('jscgjy')">添加</el-button>（超过请自行点击添加）</div> -->
          
            <div class="dot content-title">企业股权投资：</div>
            <div class="content " v-for="item,index in listInfo.qygqtz" >
              <div class="content-laber" style="width:220px">被投企业{{index+1}}名称：</div>
              <el-input v-model="item.companyName" class="line-input" disabled> </el-input>
              <div class="content-laber" style="width:170px">，成交金额：</div>
              <el-input  v-model="item.amount" class="line-input" style="width:200px" disabled> </el-input>
              <div class="content-laber" style="width:100px">亿元</div>
              <!-- <el-button type="danger" icon="el-icon-delete" circle size="mini" class="delete" @click="deleteItem('qygqtz',index)" v-if="listInfo.qygqtz.length>1"></el-button> -->
              </div>
            <!-- <div><el-button type="text" @click="addItem('qygqtz')">添加</el-button>（超过请自行点击添加）</div> -->
          </div>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="16" class="col-flex bg-ccc leftAlign-pd30 request"
            >9、创造就业机会数量<span class="col-red"
              >（本年度期间正式入职人数+期间实习人数+目前在招聘岗位数）</span
            ></el-col
          >
          <el-col :span="4" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">
            {{projectExecuteForm.ycjyrs}}
          </el-col>
          <el-col :span="4" class="col-flex bg-ccc">个</el-col>
        </el-row>

      <div class="mg-T20">
        <el-form
          :model="auditForm"
          :rules="auditFormRules"
          ref="auditForm"
          label-width="80px"
          class="demo-ruleForm"
        >
          <el-form-item label="驳回说明" prop="memo" v-if="type == 'audit'">
            <el-input v-model="auditForm.memo"></el-input>
          </el-form-item>
          <el-form-item v-if="type == 'audit'">
            <el-button type="primary" @click="adopt('auditForm')"
              >审核通过</el-button
            >
            <el-button type="danger" @click="reject('auditForm')"
              >审核驳回</el-button
            >
          </el-form-item>
          <el-form-item v-if="type == 'edit'">
            <el-button type="primary" @click="adoptEdit('auditForm')"
              >同意订正</el-button
            >
            <el-button type="danger" @click="rejectEdit('auditForm')"
              >订正驳回</el-button
            >
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
import SingleUpload from "@/components/Upload/singleUpload";
import fileUpload from "@/components/Upload/fileUpload";
import { find as companyFind, list as companyList } from "@/api/company";
import { list as dictList } from "@/api/dict";
import utils from "@/utils/utils.js";
import { validPhone, validPositiveIntAndZero } from "@/utils/validate.js";
import { save as projectSave, find as projectFind } from "@/api/adminProject";
import {
  update as projectExecuteUpdate,
  find as projectExecuteFind,adopt as projectExecuteAdopt,
  reject as projectExecuteReject, 
} from "@/api/adminProjectExecute";

export default {
  components: { SingleUpload, fileUpload },
  name: "projectExecuteAudit",
  data() {
    const validateCapital = (rule, value, callback) => {
      if (utils.isNull(value)) {
        callback();
      } else if (!validPositiveIntAndZero(value)) {
        callback(new Error("必须为大于等于0的数值"));
      } else {
        callback();
      }
    };

    var alidateMemo = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请输入驳回说明"));
      } else {
        callback();
      }
    };

    return {
      meta: [],
      companyName:"",
      projectExecuteForm: {
        projectId: "",
        companyId: "",
        tbr: "",
        lxfs:"",
        ytz: 0, //已投资',
        dzzxqys: 0, //新加｜支持带动的中小企业数量（个）',
        zczxqycxzl: 0, //新加｜支持中小企业创新产业种类（件）',
        yjgkjsnd: 0, //新加｜预计攻克技术难点数量（个）',
        jsndjs: "", //新加｜技术难点简述:难点1：,难点2：
        gkjsnd: 0, //新加｜专项已攻克的技术难点数量（个）',
        gkqkjs: "", //新加｜攻克情况简述:难点1攻克情况：,难点2攻克情况：',
        gtyzjsbzsl: 0, //新加｜共同研制技术标准数量（个）',
        jsbzjs: "", //新加｜技术标准简述:标准1：,标准2
        tzzxqyjscgsl: 0, //新加｜投资中小企业技术成果数量（个）
        tzzxqyjscgje: 0, //新加｜投资中小企业技术成果金额（亿元）
        jscgjy: "", //'新加｜技术成果交易',
        qygqtz: "", //'新加｜企业股权投资',
        ycjyrs: 0, //'已创就业人数|创造就业机会数量',
      },

      listInfo:{
        jsndjs: [
          {content:""}
        ], //新加｜技术难点简述:难点1：,难点2：
        gkqkjs: [
          {content:""}
        ], //新加｜攻克情况简述:难点1攻克情况：,难点2攻克情况：',
        jsbzjs: [
          {content:""}
        ], //新加｜技术标准简述:标准1：,标准2
        jscgjy: [
          {technologyName:"", amount:""}
        ], //'新加｜技术成果交易',
        qygqtz: [
          {companyName:"", amount:""}
        ], //'新加｜企业股权投资',
      },

      projectExecuteRules: {
        createDate: [
          { required: true, message: "请选择填报时间", trigger: "blur" },
        ],
        ytz: [{ validator: validateCapital, trigger: "blur" }],
        ycs: [{ validator: validateCapital, trigger: "blur" }],
        ycjyrs: [{ validator: validateCapital, trigger: "blur" }],
        xzrcs: [{ validator: validateCapital, trigger: "blur" }],
        xzzl: [{ validator: validateCapital, trigger: "blur" }],
        xhdrys: [{ validator: validateCapital, trigger: "blur" }],
        zcdxlz: [{ validator: validateCapital, trigger: "blur" }],
      },

      companyId: "",
      companyInfo: {},
      projectList: [],
      companyList: [],
      projectExecuteStatusDict: [],
      projectExecuteStatusPromise: "",

      //审核表单
      auditForm: {
        memo: "", //驳回说明
      },
      auditFormRules: {
        memo: [{ validator: alidateMemo, trigger: "blur" }],
      },

      scroll:"",
      //类型
      type:"",

      path: "",
    };
  },
  watch: {
    $route: {
      handler: function (route) {
        this.path = route.path
      },
      immediate: true,
    },
  },

  activated() {
    console.log("activated执行了--", this.$store.getters.closeAliveName,this.scroll);
    if (this.$store.getters.closeAliveName == "projectExecuteAudit") {
      console.log("this.projectExecuteId--", this.projectExecuteId);
      console.log("this.type--", this.type);
      if(this.projectExecuteId == this.$route.query.projectExecuteId && this.type == this.$route.query.type){
        if(this.scroll > 0){
          window.scrollTo(0, this.scroll);
          this.scroll = 0;
        }    
      }else{
        this.auditForm.memo = ""
        this.type = this.$route.query.type
        this.projectExecuteId = this.$route.query.projectExecuteId;
        this.projectExecuteFind(this.projectExecuteId);
      }
        this.$store.dispatch("user/cleanCloseAliveName");
    }else{
      if(this.scroll > 0){
        window.scrollTo(0, this.scroll);
        this.scroll = 0;
      }
    }
    
    window.addEventListener('scroll', this.handleScroll);
  },

  deactivated(){
     window.removeEventListener('scroll', this.handleScroll);
},

  created() {
    this.projectExecuteStatusPromise = utils.getDictList(
      "projectExecute_status",
      (res) => {
        this.projectExecuteStatusDict = res.data;
      }
    );

  },

  mounted() {
    window.addEventListener('scroll', this.handleScroll);
    if (this.$route.query) {
      this.projectExecuteForm.companyId = this.companyId =
        this.$route.query.companyId;
      this.projectExecuteForm.projectId = this.projectId =
        this.$route.query.projectId;
        this.type = this.$route.query.type
      this.projectExecuteId = this.$route.query.projectExecuteId;
      this.projectFind(this.projectId);
      Promise.all([this.projectExecuteStatusPromise]).then((res) => {
        this.projectExecuteFind(this.projectExecuteId);
      });
    }
  },

  destroyed() {},

  methods: {
    //监听滚动条
    handleScroll () {
      let scrollTop = document.documentElement.scrollTop;
      this.scroll = scrollTop;
    },
    
    //获取月报信息
    projectExecuteFind(id) {
      let _this = this
      projectExecuteFind(id).then((res) => {
        // console.log("获取月报信息--", res);
        if (res.type == "success") {
          this.companyName = res.data.companyName
          this.projectExecuteForm = res.data.projectExecute;
          if (!utils.isNull(_this.listInfo.gkqkjs)) {
            _this.listInfo.gkqkjs = JSON.parse(_this.projectExecuteForm.gkqkjs);
          } 
          if (!utils.isNull(_this.listInfo.jsbzjs)) {
            _this.listInfo.jsbzjs = JSON.parse(_this.projectExecuteForm.jsbzjs);
          } 
          if (!utils.isNull(_this.listInfo.jscgjy)) {
            _this.listInfo.jscgjy = JSON.parse(_this.projectExecuteForm.jscgjy);
          } 
          if (!utils.isNull(_this.listInfo.jsndjs)) {
            _this.listInfo.jsndjs = JSON.parse(_this.projectExecuteForm.jsndjs);
          } 
          if (!utils.isNull(_this.listInfo.qygqtz)) {
            _this.listInfo.qygqtz = JSON.parse(_this.projectExecuteForm.qygqtz);
          } 
          
          this.projectExecuteForm.createDate = utils.dateFormatter(
            this.projectExecuteForm.createDate
          );
        }
      });
    },

    //获取企业列表
    getCompanyList() {
      companyList().then((res) => {
        // console.log("获取企业信息--", res);
        if (res.type == "success") {
          this.companyList = res.data.data;
        }
      });
    },

    //获取项目信息
    projectFind(id) {
      projectFind(id).then((res) => {
        // console.log("获取项目信息--", res);
        if (res.type == "success") {
          this.projectInfo = res.data.project;
          this.projectExecuteForm.projectName = res.data.project.projectName;
        }
      });
    },

     //企业审核
    adopt(Form) {
      let params = new URLSearchParams();
      params.append("projectExecuteId", this.projectExecuteId);
      projectExecuteAdopt(params).then((res) => {
        // console.log("企业的审核通过--", res);
        if (res.type == "success") {
          this.$message.success("企业的审核通过");
          this.$store.dispatch("user/setCloseView", this.path)
          this.$router.push({
            path: "/projectExecute/auditList",
            query: { projectId: this.projectId },
          });
        }
      });
    },

    //审核驳回
    reject(formName) {
      this.$refs[formName].validate((valid) => {
        console.log("valid--", valid);
        if (valid) {
          let params = new URLSearchParams();
          params.append("projectExecuteId", this.projectExecuteId);
          params.append("rejectText", this.auditForm.memo);
          projectExecuteReject(params).then((res) => {
            // console.log("企业的驳回--", res);
            if (res.type == "success") {
              this.$message.success("企业的审核已经驳回");
              this.$store.dispatch("user/setCloseView", this.path)
              this.$router.push({
                path: "/projectExecute/auditList",
                query: { projectId: this.projectId },
              });
            }
          });
        }
      });
    },

    adoptEdit(){
      this.projectExecuteForm.status = 0
      projectExecuteUpdate(this.projectExecuteForm).then((res) => {
            console.log("统一订正--", res);
            if (res.type == "success") {
              this.$message.success("项目营业的订正申请已经同意");
              this.$store.dispatch("user/setCloseView", this.path)
              this.$router.push({
                path: "/projectExecute/auditList",
              });
            }
          });
    },

    rejectEdit(){
      this.projectExecuteForm.status = 2
      projectExecuteUpdate(this.projectExecuteForm).then((res) => {
            console.log("企业的驳回--", res);
            if (res.type == "success") {
              this.$message.success("项目营业的订正申请已经驳回");
              this.$store.dispatch("user/setCloseView", this.path)
              this.$router.push({
                path: "/projectExecute/auditList",
              });
            }
          });
    },

    back() {
      this.$router.go(-1);
    },

    projectExecuteStatusFormate(data) {
      return utils.selectDictLabel(
        this.projectExecuteStatusDict,
        "projectExecute_status-" + data
      );
    },
  },
};
</script>

<style lang="scss" scoped>
// 列表项样式
.content-box {
  width: 100%;

  .content-title {
    line-height: 30px;
  }

  .dot {
    position: relative;
    /* border: black 1px solid; */
  }

  .dot:before {
    content: "";
    display: inline-block;
    background-color: #000;
    position: absolute;
    top: 10px;
    left: -20px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
  }

  .content {
    width: 100%;
    display: flex;
    align-items: flex-start;
    margin-bottom: 10px;
  }

  .content-laber {
    width: 60px;
    line-height: 33px;
  }

  .delete {
    margin: auto 10px;
  }
}

.content-area {
  .content-title {
    line-height: 30px;
  }

  .dot {
    position: relative;
    /* border: black 1px solid; */
  }

  .dot:before {
    content: "";
    display: inline-block;
    background-color: #000;
    position: absolute;
    top: 10px;
    left: -20px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
  }

  .line-input {
    border-bottom: black 1px solid;
    // /deep/ .el-input__inner{
    //   border-bottom: black 1px solid !important;
    //   border-radius: 0px;

    // }
  }

  .content {
    width: 100%;
    display: flex;
    align-items: flex-start;
    margin-bottom: 10px;
  }

  .content-laber {
    width: 60px;
    line-height: 33px;
  }

  .delete {
    margin: auto 10px;
  }
}
</style>
